<template>
    <div class="warp-box">
      <h1 style="font-size:26px">注册</h1>
      <el-row>
        <el-col :span="24">
          <el-row style="min-width:1000px">
            <el-col :span="10" style="width:580px">
              <el-form size="small" :model="parames" style="margin-top:20px" :rules="rules" label-position="left" ref="parames" label-width="140px" class="zkRegister">
                <el-form-item label="主营行业:" prop="industry">
                  <el-cascader
                    @change="changeIndustry"
                    style="width:100%"
                    v-model="parames.industry"
                    :options="subjectData">
                  </el-cascader>
                </el-form-item>
                <el-form-item>
                  <p v-if="parames2.smallScaleTaxRate">小规模纳税人税率：{{parames2.smallScaleTaxRate}}</p>
                  <p v-if="parames2.generalTexRate">一般纳税人税率：{{parames2.generalTexRate}}</p>
                  <p v-if="parames2.industryInformation">行业资讯：{{parames2.industryInformation}}</p>
                </el-form-item>
                <el-form-item label="经营范围:">
                  <el-select style="width:100%" size="small" v-model="parames.businessScope" @change="changeBusinessScope">
                    <el-option v-for="(item,index) in businessScopeData" :key="index" :label="item.label" :value="item.value"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="行业许可证:">
                  <el-input disabled v-model="parames.license" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="企业类型:" prop="companyTypeId">
                  <el-select style="width:100%" size="small" v-model="parames.companyTypeId">
                    <el-option v-for="(item,index) in companyData" :key="index" :label="item.typeName" :value="item.id"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="注册资金:">
                  <el-input placeholder="请输入" type="number" v-model="parames.turnover">
                    <template slot="append">万元</template>
                  </el-input>
                </el-form-item>
                <el-form-item label="注册区域:" prop="administrativeRegion">
                  <el-cascader
                  placeholder="请选择"
                  style="width:100%"
                  :options="options"
                  v-model="parames.administrativeRegion">
                  </el-cascader>
                </el-form-item>
              </el-form>
            </el-col>
            <el-col style="width:300px;margin-left:50px" v-if="parames2.successCaseList.length>0">
              <p>成功案例:</p>
              <div v-for="(item,index) in parames2.successCaseList" :key="index" style="background: #fff;padding: 10px;margin: 10px;border: #dbdbdb solid 1px">
                <p v-if="item.customerName">客户名称：{{item.customerName}}</p>
                <p v-if="item.industryName">主营行业：{{item.industryName}}</p>
                <p v-if="item.area">注册地：{{item.area}}</p>
                <p v-if="item.registeredCapital">注册资金：{{item.registeredCapital}}(万元)</p>
              </div>
            </el-col>
          </el-row>
        </el-col>
        <el-col :span="24">
          <el-button style="margin-left:140px" size="small" type="primary" :loading="loadingBtn" @click="handleSend">保存到商机</el-button>
          <!-- <el-button size="small">创建合同</el-button> -->
        </el-col>
      </el-row>
      <createdDialog :dialogData="dialogData" ></createdDialog>
    </div>
</template>

<script>
import createdDialog from '../opportunityManage/createdDialog.vue'  //新建商机

import { provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus, CodeToText, TextToCode } from 'element-china-area-data'
/*
provinceAndCityData是省市二级联动数据（不带“全部”选项）
regionData是省市区三级联动数据（不带“全部”选项）
provinceAndCityDataPlus是省市区三级联动数据（带“全部”选项）
regionDataPlus是省市区三级联动数据（带“全部”选项）
"全部"选项绑定的value是空字符串""
CodeToText是个大对象，属性是区域码，属性值是汉字 用法例如：CodeToText['110000']输出北京市
TextToCode是个大对象，属性是汉字，属性值是区域码 用法例如：TextToCode['北京市'].code输出110000,TextToCode['北京市']['市辖区'].code输出110100,TextToCode['北京市']['市辖区']['朝阳区'].code输出110105
*/
export default {
    data() {
        return {
          options: regionData,
          loadingBtn: false,
          parames: {
            industry: [],
            industryId: '', //主营行业ID
            childIndustryId: '',
            businessScope: '', //经营范围
            license: '', //行业许可证
            companyTypeId: '', //企业类型
            administrativeRegion: [], //注册行政区域
            turnover: '', //营业额
          },
          parames2: {
            smallScaleTaxRate: '',
            generalTexRate: '',
            industryInformation: '',
            businessScopeList: [],
            successCaseList: []
          },
          subjectData: [],
          companyData: [],
          businessScopeData: [],
          dialogData: { //新建弹窗
            thinkTankId: '',
            show: false
          },
          rules: {
            industry: [
              { required: true, message: '必填', trigger: ['blur','change'] },
            ],
            businessScope: [
              { required: true, message: '必填', trigger: ['blur','change']},
            ],
            companyTypeId: [
              { required: true, message: '必填', trigger: ['blur','change'] },
            ],
            administrativeRegion: [
              { required: true, message: '必填', trigger: ['blur','change'] },
            ],
          }
        };
    },
    mounted() {
      this.getTree()
      this.getCompanyType()
    },
    methods: {
      changeBusinessScope () { // 选择范围
        this.parames2.businessScopeList.forEach(el=>{
          if (this.parames.businessScope == el.id) {
            this.parames.license = el.industryQualificationLicense
          }
        })
      },
      changeIndustry () { // 选择行业
        this.$post(this.$api.postCustomerBaseInfoIndustryFind,{
          industryId: this.parames.industry[1]
        }).then(response => {
          if (response.data.succeed) {
            let data = response.data.data
            this.parames2.smallScaleTaxRate = data.smallScaleTaxRate//小规模纳税人税率
            this.parames2.generalTexRate = data.generalTexRate//一般纳税人税率
            this.parames2.industryInformation = data.industryInformation//行业资讯,
            this.parames2.businessScopeList = data.businessScopeList
            data.successCaseList.forEach(el=>{
              if (el.administrativeRegion) {
                let area = el.administrativeRegion
                el.area = CodeToText[Number(area[0])] + '-' + CodeToText[Number(area[1])] + '-' + CodeToText[Number(area[2])]
              }
            })
            this.parames2.successCaseList = data.successCaseList
            this.businessScopeData = []
            data.businessScopeList.forEach(el=>{
              this.businessScopeData.push({
                label: el.businessScopeName,
                value: el.id,
                license: el.industryQualificationLicense
              })
            })
            this.parames.businessScope = ''
            this.parames.license = ''
          }
        })
      },
      getCompanyType () { //获取企业类型
        this.$post(this.$api.postCustomerBaseInfoInCompanyTypeList,this.parames).then(response => {
            if (response.data.succeed) {
                this.companyData = response.data.data
            }
        })
      },
      getTree () { //获取树组织
        this.$post(this.$api.postCustomerBaseInfoIndustryTree).then(response => {
          if (response.data.succeed) {
            this.subjectData = []
            if (response.data.data.length > 0) {
              response.data.data.forEach(el=>{
                this.getData(el)
                if (el.label) {
                  this.subjectData.push(el)
                }
              })
            }
          }
        })
      },
      getData(data) { //处理树数据
        if (data.industryName) {
          data.label = data.industryName
        }
        data.value = data.id
        if (data.childList.length>0) {
          data.children = data.childList
        }
        if (data.children && data.children.length > 0) {
          for(var i = 0; i < data.children.length; i++) {
            this.getData(data.children[i])
          }
        }
      },
      addressChange(arr) { //切换省市区
          console.log(arr);
          console.log(CodeToText[arr[0]], CodeToText[arr[1]], CodeToText[arr[2]]);
      },
      handleSend () { //保存
        this.$refs['parames'].validate((valid) => {
          if (valid) {
            this.loadingBtn = true
            this.parames.industryId = this.parames.industry[0]
            this.parames.childIndustryId = this.parames.industry[1]
            this.$post(this.$api.postThinkTankAdd,this.parames).then(response => {
              if (response.data.succeed) {
                this.dialogData.thinkTankId = response.data.data.thinkTankId
                this.dialogData.type = 'new'
                this.dialogData.show = true
                this.resetData()
              }
            })
            setTimeout(() => {
              this.loadingBtn = false
            }, 300);
          }
        })
      },
      resetData () {
        this.parames.industry = []
        this.parames.industryId = '' //主营行业ID
        this.parames.childIndustryId = ''
        this.parames.businessScope = '' //经营范围
        this.parames.license = '' //行业许可证
        this.parames.companyTypeId = '' //企业类型
        this.parames.administrativeRegion = [] //注册行政区域
        this.parames.turnover = '' //营业额
        this.parames2.smallScaleTaxRate = ''
        this.parames2.generalTexRate = ''
        this.parames2.industryInformation = ''
        this.parames2.businessScopeList = []
      }
    },
    components: {
      createdDialog
    },
};
</script>

<style scoped>

</style>
